<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>设置新密码</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="css/findpwd.css" />
	</head>
	<body>
		<div class="web">
			<!---------------头部----------------->
			<header class="bottom-border">
				<div class="header-btn"><a href="javascript:void(0)">取消</a></div>
				<div class="header-title">设置新密码</div>
				<div></div>
			</header>
			<!---------------内容----------------->
			<div class="content">
				<form action="" method="post">
					<div class="form-wrap">
						<div class="phone">
							<p>手机号码</p>
							<input id="phone" type="text" name="phone" placeholder="请输入手机号码"/>
						</div>
						<div class="wrap">
							<div class="vercode">
								<p>验证码</p>
								<input id="vercode" type="text" name="vercode" placeholder="请输入验证码"/>
							</div>
							<a class="sendkey" href="javascript:void(0)">获取验证码</a>
						</div>
						<div class="other-wrap">
							<div class="new-pwd">
								<p>新密码</p>
								<input id="new-pwd" type="password" name="new-pwd" placeholder="8-20位数字和字母组合"/>
							</div>
							<div class="pwd-sure no-top-border">
								<p>确认密码</p>
								<input id="pwd-sure" type="password" name="pwd-sure" placeholder="请重复输入密码"/>
							</div>
						</div>
						<input type="submit" class="submit-btn" value="完&nbsp;&nbsp;成">
					</div>	
				</form>
				<!--弹窗-->
				<div class="tipwindow">
					<div class="face">
						<img src="img/login-succeed.png" alt="" />
					</div>
					<p></p>
				</div>
			</div>
		</div>
		<script>
			function sendVercode(){
				var sendkey = document.querySelector(".sendkey");
				var tipwindow = document.querySelector(".tipwindow");
				var p = document.querySelector(".tipwindow>p");
				sendkey.addEventListener("touchend",function(){
					var cdtime = 59;
					tipwindow.style.display="block";
					p.innerText="验证码发送成功";
					setTimeout(function(){
						tipwindow.style.display="none";
					},5000)
					var time = setInterval(function(){
						sendkey.innerHTML="还剩<span>"+cdtime+"</span>s";
						cdtime--;
						if(cdtime<0){
							clearInterval(time);
							sendkey.innerText="重新发送";
						}
					},1000);
					
				})
			}
			sendVercode();
		</script>
	</body>
</html>
